<!DOCTYPE html>
<html lang="en">
<head>
<title>List Tasks</title>
          <?php include 'includes/header.php'; ?>
   </head>

<body>

	<div id="dialog-modal" title="Basic modal dialog"
		style="display: none;">
		<p>Adding the modal overlay screen makes the dialog look more
			prominent because it dims out the page content.</p>
	</div>

	<div class="container">
    
		<?php include 'includes/navbar.php';?>

      <!-- Main component -->
		<div class="jumbotron">
			<h1>List Tasks</h1>

			<table id="table1"></table>
			<div id="nav1"></div>
		</div>

	</div>
	<!-- /container -->
    <?php include 'includes/footer.php';?>	
	<!-- scripts -->
	<script>
	jQuery("#table1").jqGrid({ 
		postData : { functionName: "getTasks"},
		ajaxGridOptions : {type:"POST"}, 
		url:'Controller.php', 
		datatype: "json",   
		colNames:['id','date','duration','user_id','status','comment'], 
		colModel:[
			{name:'id',width:20},
			{name:'date', width:90},
			{name:'duration', width:90},
			{name:'user_id', width:90},
			{name:'status', width:90},
			{name:'comment', width:90}
		], 
		rowNum:10, 
		width:1000,
		rowList:[10,20,30,40],
		pager: '#nav1', 
		viewrecords: true,
		sortorder: "desc",
		caption:"New API Example" 
	}); 

	jQuery("#table1").jqGrid(
		'navGrid','#nav1',
		{edit:true,add:true,del:true}
	); 
    </script>
</body>
</html>
